<template>
  <div v-loading="loading">
    <div class="row">
      <div class="col">
        <span>项目名称：</span>
        <span>{{ project.customer_name }}</span>
      </div>
      <div class="col">
        <span>贷款年限：</span>
        <span>{{ project.load_years }}</span>
      </div>
    </div>
    <div class="row">
      <div class="col">
        <span>贷款金额：</span>
        <span>{{ project.reply_funds }}万元</span>
      </div>
      <div class="col">
        <span>保费收取方式：</span>
        <span>{{ guaFeeType }}</span>
      </div>
    </div>
  </div>
</template>

<script>
import { enumGuaFundsSelfType } from '@/credit/views/county/unionProvince/components/projectApprove/index'

export default {
  components: {},
  props: {
    relatedId: String,
  },
  data() {
    return {
      loading: false,
      project: {},
    }
  },
  computed: {
    guaFeeType() {
      return enumGuaFundsSelfType[this.project.gua_fee_coll_type] || ''
    },
  },
  watch: {
    relatedId: {
      handler: function (val) {
        val && this.getProject()
      },
      immediate: true,
    },
  },
  created() {},
  mounted() {},
  methods: {
    getProject() {
      this.project = {}
      this.loading = true
      return this.$api
        .getData({
          table: 'customer_related',
          params: {
            'customer_related_id.eq': this.relatedId,
            fields: ['customer_name', 'load_years', 'reply_funds', 'gua_fee_coll_type'],
          },
        })
        .then(res => {
          this.project = (res.data || [])[0] || {}
        })
        .finally(() => {
          this.loading = false
        })
    },
  },
}
</script>

<style lang="scss" scoped></style>
